<template>
  <div>
    <!--引导 -->
    <div class="navCir">
      <li class="active"><a href=""><i class="am-icon-home "></i>首页</a></li>
      <li><a href=""><i class="am-icon-list"></i>分类</a></li>
      <li><a href=""><i class="am-icon-shopping-basket"></i>购物车</a></li>
      <li><a href=""><i class="am-icon-user"></i>我的</a></li>
    </div>
    <!--菜单 -->
    <div class=tip>
      <div id="sidebar">
        <div id="wrap">
          <el-popover
              placement="left-start"
              width="300"
              trigger="hover"
          >
            <div id="prof" class="item " slot="reference">
              <a href="# ">
                <span class="setting"></span>
              </a>
            </div>
            <div class="ibar_login_box status_login">
              <div class="avatar_box ">
                <p class="avatar_imgbox "><img src="@/assets/images/no-img_mid_.jpg"/></p>
                <ul class="user_info ">
                  <li>用户名：sl1903</li>
                  <li>级&nbsp;别：普通会员</li>
                </ul>
              </div>
              <div class="login_btnbox ">
                <a href="# " class="login_order ">我的订单</a>
                <a href="# " class="login_favorite ">我的收藏</a>
              </div>
              <i class="icon_arrow_white "></i>
            </div>
          </el-popover>


          <div id="shopCart" class="item ">

            <a>
              <span class="message "></span>
            </a>

            <router-link to="/cart" class="cart">
              <p>
                购物车
              </p>
            </router-link>
            <p class="cart_num ">0</p>

          </div>

          <div id="asset " class="item ">
            <el-tooltip class="item" effect="dark" content="我的资产" placement="left">
              <a href="# ">
                <span class="view "></span>
              </a>
            </el-tooltip>
          </div>

          <div id="foot " class="item ">
            <el-tooltip class="item" effect="dark" content="我的足迹" placement="left">
              <a href="# ">
                <span class="zuji "></span>
              </a>
            </el-tooltip>
          </div>

          <div id="brand " class="item ">
            <el-tooltip class="item" effect="dark" content="我的收藏" placement="left">
              <a href="#">
                <span class="wdsc "><img src="@/assets/images/wdsc.png"/></span>
              </a>
            </el-tooltip>
          </div>

          <div id="broadcast " class="item ">
            <el-tooltip class="item" effect="dark" content="我要充值" placement="left">
              <a href="# ">
                <span class="chongzhi "><img src="@/assets/images/chongzhi.png"/></span>
              </a>
            </el-tooltip>
          </div>

          <div class="quick_toggle ">
            <li class="qtitem">
              <el-tooltip class="item" effect="dark" content="客服中心" placement="left">
                <a href="# "><span class="kfzx "></span></a>
              </el-tooltip>
            </li>
            <!--二维码 -->
            <li class="qtitem ">
              <a href="#none "><span class="mpbtn_qrcode "></span></a>
              <div class="mp_qrcode " style="display:none; "><img src="@/assets/images/weixin_code_145.png"/><i
                  class="icon_arrow_white "></i></div>
            </li>
            <li class="qtitem ">
              <a href="#top " class="return_top "><span class="top "></span></a>
            </li>
          </div>

          <!--回到顶部 -->
          <div id="quick_links_pop " class="quick_links_pop hide "></div>

        </div>

      </div>
      <div id="prof-content " class="nav-content ">
        <div class="nav-con-close ">
          <i class="am-icon-angle-right am-icon-fw "></i>
        </div>
        <div>
          我
        </div>
      </div>
      <div id="shopCart-content " class="nav-content ">
        <div class="nav-con-close ">
          <i class="am-icon-angle-right am-icon-fw "></i>
        </div>
        <div>
          购物车
        </div>
      </div>
      <div id="asset-content " class="nav-content ">
        <div class="nav-con-close ">
          <i class="am-icon-angle-right am-icon-fw "></i>
        </div>
        <div>
          资产
        </div>

        <div class="ia-head-list ">
          <a href="# " target="_blank " class="pl ">
            <div class="num ">0</div>
            <div class="text ">优惠券</div>
          </a>
          <a href="# " target="_blank " class="pl ">
            <div class="num ">0</div>
            <div class="text ">红包</div>
          </a>
          <a href="# " target="_blank " class="pl money ">
            <div class="num ">￥0</div>
            <div class="text ">余额</div>
          </a>
        </div>

      </div>
      <div id="foot-content " class="nav-content ">
        <div class="nav-con-close ">
          <i class="am-icon-angle-right am-icon-fw "></i>
        </div>
        <div>
          足迹
        </div>
      </div>
      <div id="brand-content " class="nav-content ">
        <div class="nav-con-close ">
          <i class="am-icon-angle-right am-icon-fw "></i>
        </div>
        <div>
          收藏
        </div>
      </div>
      <div id="broadcast-content " class="nav-content ">
        <div class="nav-con-close ">
          <i class="am-icon-angle-right am-icon-fw "></i>
        </div>
        <div>
          充值
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "IndexTip",
  data() {
    return {}
  },
  methods: {}
}
</script>

<style scoped>
.cart {
  font-size: 12px;
  width: 16px;
  margin: 0px auto;
  padding-bottom: 10px;
  color: #FFF;
  height: 80px;
}
</style>